<template>
	<view id="home">
		<tui-skeleton v-if="showSkeleton"></tui-skeleton>
		<!-- 有网内容 -->
		<view v-if="!errorNetwork">
			<view class="page-index tui-skeleton page_count" :class="{'bgf':navIndex >0}"
				:style="{visibility: showSkeleton ? 'hidden' : 'visible'}">
				<!-- 组合组件 -->
				<!-- <homeComb v-if="showHomeComb" :dataConfig="homeCombData" @changeTab="changeTab" :isScrolled="isScrolled"
					:navIndex="navIndex"></homeComb> -->
				<!-- 顶部搜索框 -->
				<view class="dingwei-txt">
					{{indexData.cityName}}<span class="iconfont icon-xiajiantou" style="font-weight: bold;"></span>
				</view>
				<view style="width: 100%;">
					<image style="width: 100%;height: 400rpx;" :src="indexData.mainImg"></image>
				</view>
				<view class="nav-list">
					<view v-for="(item,index) in indexData.navMenuList" :key="item.id" class="nav-item"
						@click="clickNav(item.id)">
						<image class="nav-item-img" :src="item.icon"></image>
						<view class="nav-item-title">{{item.title}}</view>
					</view>
				</view>
				<view class="rmbq-box">
					<view class="shu-tiao"></view>
					<text class="re-men-bi-qu">热门必去</text>
				</view>
				<view class="cate-btn-list">
					<view class="cate-btn" :class="indexData.cateBtnActived===0 ? 'cate-btn-active' : ''"
						@click="changeCateBtn(0)">美食</view>
					<view class="cate-btn" :class="indexData.cateBtnActived===1 ? 'cate-btn-active' : ''"
						@click="changeCateBtn(1)">酒店</view>
					<view class="cate-btn" :class="indexData.cateBtnActived===2 ? 'cate-btn-active' : ''"
						@click="changeCateBtn(2)">民宿</view>
				</view>
				<view class="goods-list" v-if="indexData.cateBtnActived === 0">
					<view class="goods-item" v-for="(item,index) in goodsList" :key="item.id">
						<image class="goods-item-img" :src="item.img"></image>
						<view class="goods-item-title">{{item.title}}</view>
						<view class="goods-item-price-box">
							<view class="goods-price">￥{{item.price}}</view>
							<view class="goods-origin-price">门市价{{item.originPrice}}</view>
						</view>
						<view class="goods-sale">
							半年售{{item.sale}}
						</view>
					</view>
					<view style="width:100%;text-align: center;">
						<uni-load-more :status="status" :content-text="contentText" />
					</view>
				</view>
				<view class="goods-list" v-if="indexData.cateBtnActived === 1">
					<view class="goods-item" v-for="(item,index) in jiudianList" :key="item.id">
						<image class="goods-item-img" :src="item.img"></image>
						<view class="">
							<view class="jiudian-title">{{item.title}}</view>
						</view>
						<view class="goods-item-price-box">
							<view class="goods-price">
								￥{{item.price}}
								<text style="color: #666666;font-size: 25rpx;line-height: 35rpx;height: 35rpx;">
									起</text>
							</view>
							<view class="jiudian-type">{{item.typeStr}}</view>
						</view>
					</view>
					<view style="width:100%;text-align: center;">
						<uni-load-more :status="status" :content-text="contentText" />
					</view>
				</view>
			</view>
		</view>
		<!-- 断网内容 -->
		<view v-else>
			<view class="error-network">
				<image class="img" src="/static/img/error-network.png"></image>
				<view class="title">网络连接断开</view>
				<view class="con">
					<view class="label">请检查情况：</view>
					<view class="item">· 在设置中是否已开启网络权限</view>
					<view class="item">· 当前是否处于弱网环境</view>
					<view class="item">· 版本是否过低，升级试试吧</view>
				</view>
				<view class="btn" @click="reconnect">重新连接</view>
			</view>
		</view>
		<!-- <pageFooter></pageFooter> -->
		<!-- 优惠券弹窗 -->
		<coupon-dialog :urlDomain="urlDomain" :couponModal="couponModal" @on-close="closeDialog"></coupon-dialog>
	</view>
</template>

<script>
	// +----------------------------------------------------------------------
	// | CRMEB [ CRMEB赋能开发者，助力企业发展 ]
	// +----------------------------------------------------------------------
	// | Copyright (c) 2016~2023 https://www.crmeb.com All rights reserved.
	// +----------------------------------------------------------------------
	// | Licensed CRMEB并不是自由软件，未经许可不能去掉CRMEB相关版权
	// +----------------------------------------------------------------------
	// | Author: CRMEB Team <admin@crmeb.com>
	// +----------------------------------------------------------------------
	import Auth from '@/libs/wechat';
	import Cache from '../../../utils/cache';
	import tuiSkeleton from '@/components/base/tui-skeleton.vue';
	import liveBroadcast from '@/components/homeIndex/liveBroadcast';
	import merchantList from '@/components/homeIndex/merchant.vue'
	import homeComb from '@/components/homeIndex/homeComb';
	import recommend from "@/components/base/recommend.vue";
	import seckillData from "@/components/homeIndex/seckill.vue";
	import aTip from './components/addTips.vue';
	import couponDialog from "@/components/homeIndex/couponDialog.vue"
	import coupon from "@/components/homeIndex/coupon.vue";
	import menus from "@/components/homeIndex/menus.vue";
	import pictureCube from '@/components/homeIndex/pictureCube'
	import news from '@/components/homeIndex/news'
	import goodList from '@/components/homeIndex/goodList'
	import guide from '@/components/homeIndex/guide';
	import articleList from '@/components/homeIndex/articleList'
	import swiperBg from '@/components/homeIndex/swiperBg'
	import headerSearch from '@/components/homeIndex/headerSearch';
	import cateNav from '@/components/homeIndex/cateNav';
	import richTextEditor from '@/components/homeIndex/richTextEditor';
	import shortVideo from '@/components/homeIndex/video';
	import homeTab from '@/components/homeIndex/homeTab';
	import discover from '@/components/homeIndex/discover';
	import blankPage from '@/components/homeIndex/blankPage';
	import homeTitle from '@/components/homeIndex/title';
	import pageFooter from "@/components/pageFooter/index.vue";
	import {
		getIndexData,
		setCouponReceive,
		getTheme,
		getAppVersion,
		getCategoryThird,
		getDiy,
		geocoder
	} from '@/api/api.js';
	import {
		spread
	} from "@/api/user";
	// #ifdef MP-WEIXIN || APP-PLUS
	import {
		getTemlIds
	} from '@/api/api.js';
	// #endif
	// #ifdef H5
	import {
		follow
	} from '@/api/public.js';
	// #endif
	import {
		getShare
	} from '@/api/public.js';
	import {
		goPage
	} from '@/libs/iframe.js'
	import {
		mapGetters
	} from "vuex";
	import {
		silenceBindingSpread,
		getCityList
	} from '@/utils/index.js';
	import ClipboardJS from "@/plugin/clipboard/clipboard.js";
	import animationType from '@/utils/animationType.js';
	import uniLoadMore from "@/uni_modules/uni-load-more/components/uni-load-more/uni-load-more.vue";

	const arrTemp = ["beforePay", "afterPay", "createBargain", "pink"];
	var statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 'px';
	let app = getApp();
	export default {
		computed: mapGetters(['isLogin', 'uid', 'globalData', 'bottomNavigationIsCustom']),
		components: {
			uniLoadMore,
			aTip,
			merchantList,
			homeComb,
			recommend,
			tuiSkeleton,
			seckillData,
			pageFooter,
			liveBroadcast,
			couponDialog,
			coupon,
			menus,
			pictureCube,
			news,
			goodList,
			articleList,
			swiperBg,
			headerSearch,
			cateNav,
			guide,
			richTextEditor,
			shortVideo,
			homeTab,
			discover,
			blankPage,
			homeTitle
		},
		data() {
			return {
				location: {
					longitude: null,
					latitude: null
				},
				indexData: {
					cityName: '贵阳',
					mainImg: 'http://localhost:8088/crmebimage/manual/1.png',
					navMenuList: [{
							id: 1,
							icon: 'http://localhost:8088/crmebimage/manual/nav-shunfengche.png',
							title: '顺风车',
							show: true
						},
						{
							id: 2,
							icon: 'http://localhost:8088/crmebimage/manual/nav-haowu.png',
							title: '好物',
							show: true
						},
						{
							id: 3,
							icon: 'http://localhost:8088/crmebimage/manual/nav-jiudian.png',
							title: '酒店',
							show: true
						},
						{
							id: 4,
							icon: 'http://localhost:8088/crmebimage/manual/nav-minsu.png',
							title: '民宿',
							show: true
						},
						{
							id: 5,
							icon: 'http://localhost:8088/crmebimage/manual/nav-meishi.png',
							title: '美食',
							show: true
						},
						{
							id: 6,
							icon: 'http://localhost:8088/crmebimage/manual/nav-shejiao.png',
							title: '社交',
							show: true
						},
						{
							id: 7,
							icon: 'http://localhost:8088/crmebimage/manual/nav-zhoubianjingqu.png',
							title: '周边景区',
							show: true
						},
						{
							id: 8,
							icon: 'http://localhost:8088/crmebimage/manual/nav-renwenlishi.png',
							title: '人文历史',
							show: true
						}
					],
					cateBtnActived: 0
				},
				goodsList: [{
						id: 1,
						title: '【楠火锅（中铁阅山湖鲜嬢嬢羊锅汤',
						img: 'http://localhost:8088/crmebimage/manual/2.png',
						price: 118,
						originPrice: 170,
						sale: 99
					},
					{
						id: 2,
						title: '【楠火锅（中铁阅山湖鲜嬢嬢羊锅汤',
						img: 'http://localhost:8088/crmebimage/manual/2.png',
						price: 118,
						originPrice: 170,
						sale: 99
					},
					{
						id: 3,
						title: '【楠火锅（中铁阅山湖鲜嬢嬢羊锅汤',
						img: 'http://localhost:8088/crmebimage/manual/2.png',
						price: 118,
						originPrice: 170,
						sale: 99
					},
					{
						id: 4,
						title: '【楠火锅（中铁阅山湖鲜嬢嬢羊锅汤',
						img: 'http://localhost:8088/crmebimage/manual/2.png',
						price: 118,
						originPrice: 170,
						sale: 99
					}
				],
				jiudianList: [{
						id: 1,
						title: '天豪大酒店仁怀市中枢方圆荟二转盘国酒大道建行对面',
						img: 'http://localhost:8088/crmebimage/manual/3.png',
						price: 118,
						typeStr: '舒适型'
					},
					{
						id: 2,
						title: '天豪大酒店仁怀市中枢方圆荟二转盘国酒大道建行对面',
						img: 'http://localhost:8088/crmebimage/manual/3.png',
						price: 118,
						typeStr: '舒适型'
					}
				],
				status: 'more',
				listLoading: false,
				pageParam: {
					page: 1,
					limit: 20
				},
				contentText: {
					contentdown: '加载更多',
					contentrefresh: '加载中',
					contentnomore: '我是有底线的'
				},
				urlDomain: this.$Cache.get("imgHost"),
				isNoCommodity: false,
				isScrolled: false, //是否开始滚动
				categoryId: 0,
				showSkeleton: true, //骨架屏显示隐藏
				isNodes: 0, //控制什么时候开始抓取元素节点,只要数值改变就重新抓取
				statusBarHeight: statusBarHeight,
				navIndex: 0, //判断首页显示内容，1显示分类页和商品，0首页
				ProductNavindex: 0,
				sortProduct: [],
				site_name: '', //首页title
				configApi: {}, //分享类容配置
				listActive: 0, // 当前选中项
				theme: app.globalData.theme,
				imgHost: '', //图片域名地址
				appUpdate: {},
				wxText: "点击添加到我的小程序，微信首页下拉即可访问商城。",
				locationContent: '授权位置信息，提供完整服务',
				locationStatus: false,
				sortMpTop: 0,
				// #ifdef APP-PLUS || MP
				isFixed: true,
				// #endif
				// #ifdef H5
				isFixed: false,
				// #endif
				domOffsetTop: 50,
				prodeuctTop: 30,
				sortList: [],
				sortMarTop: 0,
				navHeight: 38,
				domHeight: 0,
				cateNavActive: 0,
				couponModal: false,
				styleConfig: [], //DIY数据
				diyId: 0, //DIYID
				smallPage: false, //是否微页面
				isHeaderSerch: false,
				homeCombData: {}, //组合组件数据
				showCateNav: false, //是否显示分类导航组件
				cateNavData: {}, //分类导航组件数据
				showHomeComb: false, //是否显示组合
				showHeaderSerch: false, //是否显示搜索框
				headerSerchCombData: {}, //搜索框对象
				isShowTitle: false, //是否显示头部标题，同时也判断是否展示分类下的商品列表
				bgColor: '', //背景颜色
				bgPic: '', //背景图片
				bgTabVal: '', //背景图片样式
				windowHeight: 0,
				pageStyle: {},
				isDefault: 1, //是否首页，1是，0不是
				errorNetwork: false, //是否有网络
			}
		},
		//下拉刷新
		onPullDownRefresh() {
			// #ifdef APP-PLUS
			setTimeout(() => {
				uni.reLaunch({
					url: "/pages/xyqc/index/index"
				});
				uni.stopPullDownRefresh();
			}, 1000)
			// #endif
		},
		onLoad(options) {

			// #ifdef APP-PLUS
			//app刚进入检测有无网络
			this.snycNetWork();
			this.getInitTheme();
			//APP版本检测
			this.appVersionConfig();
			// #endif

			//获取浏览器id
			let diyid = 0;
			if (options.hasOwnProperty('id') || options.scene) {
				if (options.scene) { // 仅仅小程序扫码进入
					diyid = this.globalData.id ? this.globalData.id : 0;
				} else {
					diyid = options.id ? options.id : 0;
				}
			}

			// 当前定位
			this.currentLocation();

			//diy数据加载
			this.diyData(diyid, false);

			//首页数据加载
			this.getIndexConfig();

			let that = this;
			this.$nextTick(function() {
				uni.getSystemInfo({
					success: function(res) {
						that.windowHeight = res.windowHeight;
					}
				});
			})

			//分销关系绑定，分享需要开启分销员开关，才能绑定成功
			silenceBindingSpread(options, this.isLogin);

			// #ifdef MP || APP-PLUS
			// this.getTemlIds()
			// #endif
		},
		onShow() {
			let self = this;
			// #ifdef APP-PLUS
			setTimeout(() => {
				if (self.appUpdate.openUpgrade == 'true') {
					self.appVersionConfig();
				}
			}, 1000)
			// #endif
		},
		// 滚动监听
		onPageScroll(e) {
			// 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件
			uni.$emit('scroll');
			if (e.scrollTop > this.domOffsetTop) {
				this.isScrolled = true;
				//this.isFixed = true;
			}
			if (e.scrollTop < this.domOffsetTop) {
				this.$nextTick(() => {
					//this.isFixed = false;
					this.isScrolled = false;
				});
			}
		},
		methods: {
			// 定位
			currentLocation() {
				let that = this;
				uni.getLocation({
					// 默认为 wgs84 返回 gps 坐标，gcj02 返回国测局坐标，可用于 uni.openLocation 和 map 组件坐标，App 和 H5 需配置定位 SDK 信息才可支持 gcj02。
					type: 'gcj02',
					isHighAccuracy: true,
					success: function(res) {
						console.log('location:', res)
						console.log('经度：' + res.longitude)
						console.log('纬度：' + res.latitude)
						that.location.longitude = res.longitude;
						that.location.latitude = res.latitude;
						// 经纬度转地址
						that.geocoder(res.latitude, res.longitude);
						// uni.openLocation({
						// 	latitude: res.latitude,
						// 	longitude: res.longitude,
						// 	success: function() {
						// 		console.log('success');
						// 	}
						// });
					},
					fail: function(res) {
						console.log('定位失败')
					}
				})
			},
			// 经纬度转地址
			geocoder(latitude, longitude){
				geocoder(latitude,longitude).then(res=>{
					if(200 === res.code){
						this.indexData.cityName = res.data.city;
					}
				}).catch(res=>{
					
				})
			},
			// 切换按钮列表
			changeCateBtn(a) {
				if (a === this.indexData.cateBtnActived) return false;
				this.indexData.cateBtnActived = a;
			},
			// 导航菜单 点击事件 
			clickNav(id) {
				console.log('id==', id)
				if (id === 1) {
					uni.navigateTo({
						animationType: animationType.type,
						animationDuration: animationType.duration,
						url: '/pages/xyqc/sfc/client/now'
					})
				} else if (id === 2) {
					uni.navigateTo({
						animationType: animationType.type,
						animationDuration: animationType.duration,
						url: '/pages/index/index'
					})
				} else if (id === 3) {

				} else if (id === 4) {

				} else if (id === 5) {

				} else if (id === 6) {

				} else if (id === 7) {

				} else if (id === 8) {

				}
			},
			// 加载列表
			loadMore() {
				console.log('加载更多')
				// 美食
				if (this.indexData.cateBtnActived === 0) {

				}
				// 酒店
				else if (this.indexData.cateBtnActived === 1) {

				}
				// 民宿
				else if (this.indexData.cateBtnActived === 2) {

				}
			},
			getInitTheme() {
				let that = this;
				// 主题变色
				getTheme().then(resP => {
					this.$Cache.set('theme', `theme${Number(resP.data.value)}`);
				})
			},
			//app刚进入检测有无网络
			snycNetWork() {
				uni.getNetworkType({
					success: res => {
						//res.networkType === 'none'无网络
						this.errorNetwork = res.networkType === 'none';
						//如果没有网络，清除骨架屏
						if (this.errorNetwork) this.reloadData();
					}
				});
			},
			// 断网后重新链接
			reconnect() {
				uni.getNetworkType({
					success: res => {
						this.errorNetwork = res.networkType === 'none';
						if (!this.errorNetwork) {
							setTimeout(() => {
								uni.reLaunch({
									url: "/pages/index/index"
								});
							}, 1000)
						}
					}
				});
			},
			/**
			 * 获取DIY
			 * @param {number} id
			 * @param {boolean} type 区分是否是微页面
			 */
			diyData(id, type) {
				let that = this;
				that.styleConfig = []
				uni.showLoading({
					title: '加载中...'
				});
				getDiy(id).then(res => {
					that.errorNetwork = false;
					uni.setNavigationBarTitle({
						title: res.data.title
					});
					let data = res.data;
					that.diyId = res.data.id;
					that.isDefault = data.isDefault; //是否是首页，1是，0不是
					that.styleConfig = that.objToArr(res.data.value);
					that.pageStyle = {
						'background-color': data.isBgColor === 1 ? res.data.colorPicker : '',
						'background-image': data.isBgPic === 1 ? `url(${res.data.bgPic})` : '',
						'background-repeat': res.data.bgTabVal === 1 ? 'repeat-y' : 'no-repeat',
						'background-size': res.data.bgTabVal === 2 ? 'cover' : 'contain'
					};
					uni.hideLoading();
					if (type) {
						that.styleConfig.forEach((item) => {
							if (item.name == 'headerSerch' || item.name == 'homeComb' || item.name ==
								'tabNav') {
								that.styleConfig.splice(index, 1);
							}
						});
					} else {
						that.styleConfig.forEach((item) => {
							if (item.name === 'tabNav') {
								that.showCateNav = true;
								that.cateNavData = item;
							}
							if (item.name === 'homeComb') {
								that.showHomeComb = true
								that.homeCombData = item;
							}
							if (item.name === 'headerSerch') {
								that.showHeaderSerch = true
								that.headerSerchCombData = item;
							}
						});
					}
					setTimeout(() => {
						that.isNodes++;
					}, 100);
					//新人礼的展示判断
					let newGift = that.$Cache.get('newGift') ? JSON.parse(that.$Cache.get('newGift')) : [];
					uni.getImageInfo({
						src: `${that.urlDomain}crmebimage/presets/coupon_modal_bg.png`,
						success: function(image) {
							that.couponModal = newGift.length ? true : false;
						}
					});
				}).catch(err => {
					return that.$util.Tips({
						title: err
					});
					uni.hideLoading();
				});
			},
			// 对象转数组
			objToArr(data) {
				let obj = Object.keys(data).sort();
				let m = obj.map(key => data[key]);
				return m;
			},
			bindMore() {
				uni.setStorageSync('cateNavActive', this.cateNavActive);
				uni.setStorageSync('categoryId', this.categoryId);
				uni.switchTab({
					url: `/pages/goods_cate/index`
				})
			},
			getRecommendLength(e) {
				this.isNoCommodity = e == 0 ? true : false;
			},
			// 导航分类切换
			changeTab(index, item) {
				//type=0微页面，1分类，2首页
				this.cateNavActive = index;
				if (item.type == 1) {
					this.navIndex = 1;
					if (!item.val) {
						this.sortList = [];
						this.categoryId = 0;
						this.$util.Tips({
							title: "请在平台端选择商品分类！确保加载商品分类数据。"
						});
						return;
					} else {
						getCategoryThird(item.val).then(res => {
							this.sortList = res.data;
							// #ifdef H5
							self.sortMarTop = 10;
							// #endif
						});
						this.categoryId = item.val;
						this.isShowTitle = false;
					}
				} else if (item.type == 0) {
					this.navIndex = 0;
					this.isShowTitle = true;
					this.categoryId = 0;
					if (!item.val) {
						return this.$util.Tips({
							title: "请在平台端选择微页面链接！确保加载微页面数据。"
						});
					} else {
						this.styleConfig = [];
						this.diyData(item.val, true);
					}
				} else {
					this.categoryId = 0;
					this.navIndex = 0;
					this.styleConfig = [];
					this.diyData(item.val, false);
				}
			},
			toNewsList() {
				uni.navigateTo({
					animationType: animationType.type,
					animationDuration: animationType.duration,
					url: '/pages/goods/news_list/index'
				})
			},
			//清除骨架屏
			reloadData() {
				this.showSkeleton = false;
			},
			getElementData(el, callback) {
				uni.createSelectorQuery().in(this).selectAll(el).boundingClientRect().exec((data) => {
					callback(data[0]);
				});
			},
			xieyiApp() {
				uni.navigateTo({
					url: '/pages/users/web_page/index?webUel=https://admin.java.crmeb.net/useragreement/xieyi.html&title=协议内容'
				})
			},
			// #ifdef APP-PLUS
			xieyiApp() {
				uni.navigateTo({
					animationType: animationType.type,
					animationDuration: animationType.duration,
					url: '/pages/users/web_page/index?webUel=https://admin.java.crmeb.net/useragreement/xieyi.html&title=协议内容'
				})
			},
			// #endif
			// #ifdef MP || APP-PLUS
			getTemlIds() {
				for (var i in arrTemp) {
					this.getTem(arrTemp[i]);
				}
			},
			getTem(data) {
				getTemlIds({
					type: data
				}).then(res => {
					if (res.data) {
						let arr = res.data.map((item) => {
							return item.tempId
						})
						wx.setStorageSync('tempID' + data, arr);
					}
				});
			},
			// #endif
			// 首页数据
			getIndexConfig: function() {
				let that = this;
				getIndexData().then(res => {
					let imgHost = res.data.logoUrl.split('crmebimage')[0];
					that.imgHost = imgHost;
					that.$Cache.set('imgHost', imgHost + '/');
					// #ifdef H5 || APP-PLUS
					that.$store.commit("SET_CHATURL", res.data.yzfUrl);
					Cache.set('chatUrl', res.data.yzfUrl);
					// #endif
					Cache.setItem({
						name: 'platChatConfig',
						value: {
							servicePhone: res.data.consumerHotline, //客服电话
							serviceLink: res.data.consumerH5Url, //云智服
							serviceType: res.data.consumerType //客服类型四选一
						}
					});
					// this.shareApi();
					this.reloadData();
					// #ifdef MP
					// if (!Cache.has('user_latitude')) {
					// 	this.locationStatus = true;
					// }
					// #endif

				}).catch(error => {
					// #ifdef APP-PLUS
					// setTimeout(e => {
					// 	this.getIndexConfig();
					// }, 2000)
					// #endif
				});;
			},
			appVersionConfig() {
				var that = this;
				//app升级
				// 获取本地应用资源版本号
				getAppVersion().then(res => {
					console.log('版本号', res)
					that.$set(that.appUpdate, 'androidAddress', res.data.androidAddress);
					that.$set(that.appUpdate, 'appVersion', res.data.appVersion);
					that.$set(that.appUpdate, 'iosAddress', res.data.iosAddress);
					that.$set(that.appUpdate, 'openUpgrade', res.data.openUpgrade);
					plus.runtime.getProperty(plus.runtime.appid, function(inf) {
						let nowVersion = (inf.version).split('.').join('');
						let appVersion = (res.data.appVersion).split('.').join('');
						uni.getSystemInfo({
							success: (res) => {
								if (appVersion > nowVersion) {
									uni.showModal({
										title: '更新提示',
										content: '发现新版本，是否前去下载?',
										showCancel: that.appUpdate.openUpgrade == '1' ?
											true : false,
										cancelColor: '#eeeeee',
										confirmColor: '#FF0000',
										success(response) {
											if (response.confirm) {
												switch (res.platform) {
													case "android":
														plus.runtime.openURL(that
															.appUpdate
															.androidAddress);
														break;
													case "ios":
														plus.runtime.openURL(encodeURI(
															that.appUpdate
															.iosAddress));
														break;
												}

											}
										}
									});
								}
							}
						})
					});
				})
			},
			shareApi: function() {
				getShare().then(res => {
					this.$set(this, 'configApi', res.data);
					this.$set(this, "site_name", res.data.title);
					uni.setNavigationBarTitle({
						title: this.site_name
					})
					// #ifdef H5
					this.setOpenShare(res.data);
					// #endif
				})
			},
			// 微信分享；
			setOpenShare: function(data) {
				let that = this;
				if (that.$wechat.isWeixin()) {
					let configAppMessage = {
						desc: data.synopsis,
						title: data.title,
						link: location.href,
						imgUrl: data.img
					};
					that.$wechat.wechatEvevt(["updateAppMessageShareData", "updateTimelineShareData"],
						configAppMessage);
				}
			},
			stopTouchMove() {
				return true //禁止新闻swiper手动滑动
			},
			closeDialog() {
				this.couponModal = false;
				this.$Cache.clear('newGift');
			},
			goDetail(item) {
				uni.navigateTo({
					url: `/pages/goods/goods_details/index?id=${item.id}`
				});
			},
		},
		mounted() {
			// let query = uni.createSelectorQuery().in(this);
			// query.select("#home").boundingClientRect();
			// query.exec(res => {
			// 	this.domHeight = res[0].height;
			// })
			// let self = this;
			// // #ifdef H5 || APP-PLUS
			// // 获取H5 搜索框高度
			// let appSearchH = uni.createSelectorQuery().select(".serch-wrapper");
			// appSearchH.boundingClientRect(function(data) {
			// 	self.searchH = data.height
			// }).exec()
			// // #endif
		},
		onReachBottom() {
			if (this.status == 'noMore') {
				return;
			}
			if (this.listLoading) {
				return;
			}
			this.pageParam.page = this.pageParam.page + 1;
			this.loadMore();
		},
		/**
		 * 用户点击右上角分享
		 */
		// #ifdef MP
		onShareAppMessage: function() {
			return {
				title: this.configApi.title,
				imageUrl: this.configApi.img,
				desc: this.configApi.synopsis,
				path: '/pages/xyqc/index/index'
			};
		}
		// #endif
	}
</script>
<style>
	page {
		height: auto;
		display: flex;
		flex-direction: column;
		height: 100%;
		/* #ifdef H5 */
		background-color: #fff;
		/* #endif */

	}
</style>
<style lang="scss" scoped>
	#home {
		background-color: #FFFFFF;
	}

	.dingwei-txt {
		margin-top: 40rpx;
		height: 100rpx;
		line-height: 100rpx;
		padding-left: 30rpx;
		font-size: 33rpx;
		font-weight: 400;
		color: #333333;
	}

	.nav-list {
		padding-top: 30rpx;
		padding-bottom: 30rpx;
		display: flex;
		flex-wrap: wrap;
		text-align: center;
		background: linear-gradient(180deg, #F7FFFA 0%, #FFFFFF 100%);
	}

	.nav-item {
		padding-top: 30rpx;
		padding-bottom: 30rpx;
		width: 25%;
	}

	.nav-item-img {
		width: 86rpx;
		height: 86rpx;
	}

	.nav-item-title {
		font-size: 29rpx;
		font-weight: 500;
		color: #333333;
		font-family: PingFangSC, PingFang SC;
		line-height: 41rpx;
	}

	.rmbq-box {
		display: flex;
		align-items: center;
		padding-left: 30rpx;
	}

	.shu-tiao {
		width: 11rpx;
		height: 28rpx;
		background: #6FC65E;
		border-radius: 6rpx;
	}

	.re-men-bi-qu {
		margin-left: 18rpx;
		font-size: 33rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 500;
		color: #000000;
		line-height: 47rpx;
	}

	.cate-btn-list {
		display: flex;
		align-items: center;
		padding-left: 30rpx;
		margin-top: 38rpx;
	}

	.cate-btn {
		width: 133rpx;
		height: 51rpx;
		line-height: 51rpx;
		border-radius: 26rpx;
		border: 1rpx solid #CCCCCC;
		text-align: center;
		font-size: 29rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		color: #999999;
		margin-right: 22rpx;
	}

	.cate-btn-active {
		background: #6FC65E;
		border: none;
		color: #FFFFFF;
	}

	.goods-list {
		padding: 0 30rpx 0rpx 30rpx;
		margin-top: 44rpx;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		gap: 20rpx 16rpx;
	}

	.goods-item {
		overflow: hidden;
		width: calc(50% - 8rpx);
		background: #FFFFFF;
		border-radius: 21rpx;
		border: 1rpx solid #E2E5E9;
	}

	.goods-item-img {
		width: 100%;
		height: 333rpx;
	}

	.goods-item-title {
		margin-top: 15rpx;
		width: 100%;
		height: 41rpx;
		font-size: 29rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		color: #333333;
		line-height: 41rpx;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.goods-item-price-box {
		margin-bottom: 20rpx;
		margin-top: 20rpx;
		height: 47rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.goods-price {
		font-size: 33rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 500;
		color: #EC7F2F;
		line-height: 47rpx;
		padding-left: 20rpx;
	}

	.goods-origin-price {
		height: 35rpx;
		font-size: 25rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		color: #999999;
		line-height: 35rpx;
		padding-right: 20rpx;
	}

	.goods-sale {
		height: 35rpx;
		font-size: 25rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		color: #999999;
		line-height: 35rpx;
		padding-left: 20rpx;
		margin-bottom: 20rpx;
	}

	.jiudian-title {
		margin-top: 15rpx;
		width: 100%;
		font-size: 29rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		color: #333333;
		overflow: hidden;
		text-overflow: ellipsis;
		word-break: break-all;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
	}

	.jiudian-type {
		padding-right: 18rpx;
		height: 35rpx;
		font-size: 25rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		color: #999999;
		line-height: 35rpx;
	}


	.error-network {
		position: fixed;
		left: 0;
		top: 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%;
		height: 100%;
		padding-top: 40rpx;
		background: #fff;
		padding-top: 30%;

		.img {
			width: 414rpx;
			height: 336rpx;
		}

		.title {
			position: relative;
			top: -40rpx;
			font-size: 32rpx;
			color: #666;
		}

		.con {
			font-size: 24rpx;
			color: #999;

			.label {
				margin-bottom: 20rpx;
			}

			.item {
				margin-bottom: 20rpx;
			}
		}

		.btn {
			display: flex;
			align-items: center;
			justify-content: center;
			width: 508rpx;
			height: 86rpx;
			margin-top: 100rpx;
			border: 1px solid #d74432;
			color: #e93323;
			font-size: 30rpx;
			border-radius: 120rpx;
		}
	}

	.ysize {
		background-size: 100%;
	}

	.fullsize {
		background-size: 100% 100%;
	}

	.repeat {
		background-repeat: repeat;
	}

	.noRepeat {
		background-repeat: no-repeat;
	}

	.noCommodity {
		margin-top: 30%;
	}

	.icon-gengduo1 {
		color: #F8F8F8;
	}

	.pageIndex {
		padding: 0 24rpx;
	}

	.productList {
		background-color: #F5F5F5;
		margin-top: 20rpx;

		// min-height: 70vh;
		.sort {
			width: 710rpx;
			max-height: 380rpx;
			background: rgba(255, 255, 255, 1);
			border-radius: 16rpx;
			padding: 0rpx 0rpx 20rpx 0rpx !important;
			flex-wrap: wrap;
			margin: 25rpx auto 0 auto;

			&.no_pad {
				padding: 0;
			}

			.item {
				width: 20%;
				margin-top: 20rpx;
				text-align: center;

				.pictrues {
					width: 90rpx;
					height: 90rpx;
					background: #F5F5F5;
					border-radius: 50%;
					margin: 0 auto;
				}

				.pictrue {
					width: 90rpx;
					height: 90rpx;
					background: #F5F5F5;
					border-radius: 50%;
					margin: 0 auto;
				}

				.slide-image {
					width: 90rpx;
					height: 90rpx;
					border-radius: 50%;
					overflow: hidden;
				}

				/deep/ .easy-loadimage,
				uni-image,
				.easy-loadimage {
					width: 90rpx;
					height: 90rpx;
					display: inline-block;
				}

				.text {
					color: #272727;
					font-size: 24rpx;
					margin-top: 10rpx;
					// overflow: hidden;
					white-space: nowrap;
					text-overflow: ellipsis;
				}
			}
		}
	}

	.productList .list {
		padding: 0 20rpx;
	}

	.productList .list.on {
		background-color: #fff;
		border-top: 1px solid #f6f6f6;
	}

	.productList .list .item {
		width: 345rpx;
		margin-top: 20rpx;
		background-color: #fff;
		border-radius: 10rpx;

		.name {
			display: flex;
			align-items: center;

			.name_text {
				display: inline-block;
				max-width: 200rpx;
			}
		}
	}

	.page-index {
		display: flex;
		flex-direction: column;
		min-height: 100%;

		.page_content {

			// background-color: #f5f5f5;
			.swiper {
				position: relative;
				width: 100%;
				height: 246rpx;
				margin: 0 auto;
				border-radius: 10rpx;
				overflow: hidden;
				margin-bottom: 25rpx;
				/* #ifdef MP */
				margin-top: 20rpx;

				/* #endif */
				swiper,
				swiper-item,
				.slide-image,
				image {
					width: 100%;
					height: 246rpx;
					border-radius: 10rpx;
				}
			}
		}
	}

	.fixed {
		z-index: 100;
		position: fixed;
		left: 0;
		top: 0;
		background: linear-gradient(90deg, red 50%, #ff5400 100%);

	}

	.menu-txt {
		font-size: 24rpx;
		color: #454545;
	}
</style>